<template>
	<view class="main">
		<wd-tabs v-model="tab" sticky>
			<wd-tab title="业主">
				<view class="content">
					<wd-cell v-for="(item , index) in members.filter(mem => mem.membership == 0)" :key="item.uid"
						:title="item.name" :value="item.phoneNum" clickable @click="jumpDetail(item.uid)" />
				</view>
			</wd-tab>
			<wd-tab title="住户">
				<view class="content">
					<wd-cell v-for="(item , index) in members.filter(mem => mem.membership == 1)" :key="item.uid"
						:title="item.name" :value="item.phoneNum" clickable @click="jumpDetail(item.uid)" />
				</view>
			</wd-tab>
		</wd-tabs>
	</view>

</template>

<script setup>
	const members = [{
			uid: "01",
			name: '业主',
			phoneNum: 13131313313,
			membership: 0
		},
		{
			uid: "02",
			name: '住户01',
			phoneNum: 13131313313,
			membership: 1
		},
		{
			uid: "03",
			name: '住户02',
			phoneNum: 13131313313,
			membership: 1
		},
		{
			uid: "04",
			name: '住户03',
			phoneNum: 13131313313,
			membership: 1
		},
	]

	function jumpDetail(params) {
		uni.navigateTo({
			url: `/pages/servers/FamilyMembers/MemberDetail/MemberDetail?uid=${params}`
		})
	}
</script>

<style>
	.main {
		min-height: 100vh;
		background-color: rgb(238, 238, 238);
	}

	.content {
		height: 100%;
	}
</style>